NETOBSERV-2097 SDK + PF6 migration by jpinsonneau · Pull Request #1365 · netobserv/netobserv-web-console

jpinsonneau · 2026-03-20T11:59:00Z

Description

PatternFly 6, React 18, React Router 7, and OpenShift Console SDK 4.22 migration. This branch is rebased on 4.22-refactoring.

Slack thread with more details: https://redhat-internal.slack.com/archives/C02939DP5L5/p1773758235406749

Dependencies: #1398 #1417
Cypress followup: #1426

Assisted-by: claude-4.6-opus-high

Dependency Updates

OpenShift Console SDK

"@openshift-console/dynamic-plugin-sdk": "1.0.0" → "4.22.0-prerelease.2"
"@openshift-console/dynamic-plugin-sdk-webpack": "1.0.2" → "4.22.0-prerelease.2"

PatternFly 6

Package	From	To
`@patternfly/patternfly`	`^5.4.0`	`^6.4.0`
`@patternfly/react-charts`	`^7.4.0`	`^8.0.0`
`@patternfly/react-code-editor`	`^5.4.0`	`^6.0.0`
`@patternfly/react-core`	`^5.4.0`	`^6.4.0`
`@patternfly/react-icons`	`^5.4.0`	`^6.4.0`
`@patternfly/react-styles`	`^5.4.0`	`^6.4.0`
`@patternfly/react-table`	`^5.4.0`	`^6.4.0`
`@patternfly/react-tokens`	`^5.4.0`	`^6.4.0`
`@patternfly/react-topology`	`^5.4.0`	`^6.0.0`

Added: @patternfly/react-drag-drop ^6.4.0

React 18

Package	From	To
`react`	`^17.0.2`	`^18.3.0`
`react-dom`	`^17.0.2`	`^18.3.0`
`@types/react`	`^17.0.1`	`^18.3.0`
`@types/react-dom`	`^17.0.1`	`^18.3.0`

Standalone app uses createRoot (React 18) instead of ReactDOM.render
Added children?: React.ReactNode to component interfaces (no longer implicit in React.FC)

React Router 7

Package	From	To
`react-router`	`5.3.x`	`~7.13.1`

Removed:

react-router-dom 5.3.x
react-router-dom-v5-compat 6.11.2
@types/react-router 5.1.20
@types/react-router-dom ^5.3.3

All imports updated from react-router-dom-v5-compat → react-router.

i18next

Package	From	To
`i18next`	`^21.8.14`	`~25.6.2`
`react-i18next`	`^11.8.11`	`~16.5.8`

Testing

Package	From	To
`@testing-library/react`	`^12.1.5`	`^16.3.2`

Added: @testing-library/dom ^10.4.1

Removed: @testing-library/react-hooks (included in RTL 16)

Webpack & Build

Package	From	To
Webpack	`5.75.0`	`^5.100.0`
`webpack-cli`	`5.1.4`	`^5.1.4`
`webpack-dev-server`	`5.2.2`	`^5.2.2`

Added: ajv ^8.17.0 (direct devDep to resolve ajv-keywords v5 peer dep conflict with SDK's nested ajv v6)

Other

victory ^37.0.0 (required for PF6 charts)
Removed react-modal (replaced with PF6 native Modal)
Removed @openshift-console/plugin-shared (now included in SDK)

Automated Codemods Applied

npx @patternfly/pf-codemods@latest --v6 --fix src/
npx @patternfly/class-name-updater@latest --v6 --fix .
npx @patternfly/css-vars-updater@latest .

Text/TextContent/TextList/TextListItem → Content
AccordionToggle: moved isExpanded prop to AccordionItem
AccordionContent: removed isHidden prop
EmptyState component refactoring
Victory chart imports updated to /victory path
CSS class names from pf-v5-* to pf-v6-*
CSS variable updates (non-color automatic, colors marked --pf-t--temp--dev--tbd)

TypeScript Error Resolution (All 125 errors fixed)

Core Library Updates — Installed missing @rjsf/utils, fixed TFunction imports, added children?: React.ReactNode to component interfaces, fixed ForwardRef patterns
RJSF Fixes — Aligned @rjsf/utils v5.24.13 with @rjsf/core v5.24.12, fixed template/widget typing
PF6 Component API — Removed placeholder from Select, fixed Label colors (cyan→teal, gold→yellow), replaced Text with Content
Dark Theme CSS — Removed obsolete patternfly-charts-theme-dark.css and patternfly-theme-dark.css imports (dark theme now built-in to PF6)
Modal Migration — Migrated from custom react-modal wrapper to native PF6 Modal/ModalHeader/ModalBody/ModalFooter

CSS / Theme Migration

Dark Mode

Removed custom dark/light class toggles in table CSS; PF6 uses .pf-v6-theme-dark on <html>
Merged light-stripped/dark-stripped into single stripped class using var(--pf-t--global--background--color--secondary--default)
Merged light-bottom-shadow/dark-bottom-shadow into bottom-shadow using var(--pf-t--global--border--color--default)
Merged light-bottom-border/dark-bottom-border into bottom-border using var(--pf-t--global--border--color--default)
Fixed standalone dark mode: pf-v5-theme-dark → pf-v6-theme-dark

CSS Variable Migration (PF5 → PF6 tokens)

PF5 Variable	PF6 Token
`--pf-v5-global--BackgroundColor--100`	`--pf-t--global--background--color--primary--default`
`--pf-v5-global--BackgroundColor--200`	`--pf-t--global--background--color--secondary--default`
`--pf-v5-global--Color--100`	`--pf-t--global--text--color--regular`
`--pf-v5-global--Color--200`	`--pf-t--global--text--color--subtle`
`--pf-v5-global--FontSize--sm`	`--pf-t--global--font--size--sm`
`--pf-v5-global--BorderColor--*`	`--pf-t--global--border--color--default`
`--pf-v5-global--BorderRadius--sm`	`--pf-t--global--border--radius--small`
`--pf-v5-global--primary-color--100`	`--pf-t--global--color--brand--default`
`--pf-v5-global--success-color--100`	`--pf-t--global--color--status--success--default`
`--pf-v5-global--danger-color--100`	`--pf-t--global--color--status--danger--default`
`--pf-v5-global--warning-color--100`	`--pf-t--global--color--status--warning--default`
`--pf-v5-c-*`	`--pf-v6-c-*`
`pf-v5-m-*` modifiers	`pf-m-*` (no version prefix in PF6)

`isDark` prop cleanup

Removed isDark prop from: MetricsDonut, MetricsGraph, MetricsGraphWithTotal, ElementPanelMetrics, NetflowTableHeader, NetflowTable
Retained isDark only in histogram.tsx (needed for BrushHandleComponent SVG colors and exportToPng background)

PF6 Component Workarounds

DragDropSort portal target (`modal.tsx`)

Issue: PF6's DragDropContainer hardcodes document.getElementById('root'), but Console uses id="app"
Fix: Added ensureRootElement() that creates a <div id="root"> fallback
TODO: Remove when PF6 adds appendTo prop to DragDropContainer

Nested Accordion expand/collapse (`fields.tsx`, `dynamic-form.css`)

Issue 1: <label htmlFor="..."> inside AccordionToggle caused double-click
Fix 1: Replaced <label> with <span> in the toggle
Issue 2: PF6 accordion CSS variables cascade from expanded parent to nested collapsed items
Fix 2: Added CSS rule: .co-dynamic-form__accordion .pf-v6-c-accordion__item:not(.pf-m-expanded) > .pf-v6-c-accordion__expandable-content { display: none; }

Build Tooling

Added .golangci.yml for golangci-lint v2 (node_modules exclusion for flatted Go files)
Updated test setup to mock react-router instead of react-router-dom / react-router-dom-v5-compat

Checklist

Does the changes in PR need specific configuration or environment set up for testing?
If so please describe it in PR description.
QE requirements (check 1 from the list):
- Standard QE validation, with pre-merge tests unless stated otherwise.

Tested on OCP 4.22.0-0-2026-04-02-114050-test-ci-ln-vi34h7b-latest

Summary by CodeRabbit

New Features/Enhancements
- Upgraded UI framework to PatternFly v6 with enhanced styling and component behavior
- Migrated to React 18 for improved performance
- Updated routing system with modern navigation APIs
Bug Fixes
- Corrected spelling error in storage divergence status message
Updates
- Removed deprecated translation entries

openshift-ci · 2026-03-20T11:59:05Z

Skipping CI for Draft Pull Request.
If you want CI signal for your change, please convert it to an actual PR.
You can still manually trigger a test run with /test all

jpinsonneau · 2026-03-26T10:00:48Z

Rebased without changes

coderabbitai · 2026-03-26T10:00:48Z

Note

Reviews paused

It looks like this branch is under active development. To avoid overwhelming you with review comments due to an influx of new commits, CodeRabbit has automatically paused this review. You can configure this behavior by changing the reviews.auto_review.auto_pause_after_reviewed_commits setting.

Use the following commands to manage reviews:

@coderabbitai resume to resume automatic reviews.
@coderabbitai review to trigger a single review.

Use the checkboxes below for quick actions:

▶️ Resume reviews
🔍 Trigger review

📝 Walkthrough

Walkthrough

This PR is a comprehensive upgrade of the web console from PatternFly v5 to v6, React 17 to React 18, and React Router v5-compat to v6. It updates all component selectors, CSS tokens, typography components, modal implementation, drag-drop library, testing infrastructure, and package dependencies to align with the new framework versions.

Changes

Cohort / File(s)	Summary
PatternFly Typography Migration (Text→Content) `web/src/components/alerts/banner.tsx`, `web/src/components/drawer/element/`, `web/src/components/dropdowns/overview-display-options.tsx`, `web/src/components/dropdowns/query-options-panel.tsx`, `web/src/components/dropdowns/table-display-options.tsx`, `web/src/components/dropdowns/topology-display-options.tsx`, `web/src/components/forms/consumption.tsx`, `web/src/components/forms/resource-delete-modal.tsx`, `web/src/components/forms/resource-status.tsx`, `web/src/components/guided-tour/guided-tour.tsx`, `web/src/components/health/`, `web/src/components/messages/`, `web/src/components/modals/export-modal.tsx`, `web/src/components/modals/time-range-modal.tsx`, `web/src/components/query-summary/`, `web/src/components/tabs/netflow-overview/netflow-overview-panel.tsx`, `web/src/components/tabs/netflow-overview/panel-kebab.tsx`, `web/src/components/tabs/netflow-topology/netflow-topology.tsx`, `web/src/components/tabs/netflow-topology/peer-resource-link.tsx`, `web/src/components/toolbar/filters/chips-popover.tsx`, `web/src/components/toolbar/filters/filter-hints.tsx`, `web/src/components/toolbar/filters/filters-chips.tsx`, `web/src/components/netflow-traffic.tsx`	Replaced PatternFly Text/TextVariants usage with Content/ContentVariants throughout the codebase. Maintained existing layout, event handlers, and conditional rendering logic.
PatternFly CSS Class Selector Updates (v5→v6) `web/cypress/e2e/topology/topology.spec.ts`, `web/cypress/support/commands.ts`, `web/cypress/views/list-page.ts`, `web/cypress/views/operator-hub-page.tsx`, `web/cypress/views/yaml-editor.ts`, `web/src/components/drawer/element/element-panel.css`, `web/src/components/drawer/record/record-panel.css`, `web/src/components/dropdowns/.css`, `web/src/components/dropdowns/.tsx`, `web/src/components/forms/dynamic-form/dynamic-form.css`, `web/src/components/forms/widgets.tsx`, `web/src/components/forms/editor-toggle.tsx`, `web/src/components/modals/.css`, `web/src/components/tabs/netflow-table/.css`, `web/src/components/tabs/netflow-topology/.css`, `web/src/components/toolbar/filters/filters-toolbar.css`, `web/cypress/integration-tests/`, `web/cypress/views/netflow-page.ts`	Updated all PatternFly class selectors from `.pf-v5-c-` to `.pf-v6-c-` across CSS files, Cypress tests, and component className props. No functional logic changes.
PatternFly EmptyState & Accordion Markup Updates `web/src/components/drawer/element/element-panel-content.tsx`, `web/src/components/drawer/record/record-panel.tsx`, `web/src/components/health/health-drawer-container.tsx`, `web/src/components/health/health-error.tsx`, `web/src/components/health/health-global.tsx`, `web/src/components/messages/empty.tsx`, `web/src/components/messages/error.tsx`, `web/src/components/messages/panel-error-indicator.tsx`, `web/src/components/metrics/histogram.tsx`, `web/src/components/netflow-traffic-tab.tsx`	Migrated EmptyState composition from EmptyStateHeader/EmptyStateIcon to direct titleText/icon props. Updated accordion `isExpanded`/`isHidden` prop patterns to use only `isExpanded` on `AccordionItem`.
PatternFly CSS Theme Token Migration `web/src/components/drawer/record/record-field.css`, `web/src/components/health/health.css`, `web/src/components/health/rule-details.css`, `web/src/components/messages/error.css`, `web/src/components/messages/error-suggestions.css`, `web/src/components/messages/panel-error-indicator.css`, `web/src/components/query-summary/query-summary.css`, `web/src/components/tabs/netflow-table/netflow-table-header.css`, `web/src/components/tabs/netflow-topology/2d/topology-content.css`, `web/src/standalone/index.css`	Replaced hardcoded hex colors and `--pf-v5-` variables with PatternFly v6 theme tokens (`--pf-t--global--`). Updated dark/light theme selectors to use single variable with `.pf-v6-theme-dark` class.
React Modal → PatternFly Modal Migration `web/src/components/modals/modal.css`, `web/src/components/modals/modal.tsx`	Replaced `react-modal` with PatternFly Modal components. Removed custom CSS for modal overlay/dialog centering/theming. Added `ensureRootElement()` helper function and updated Modal to use `ModalHeader`, `ModalBody`, `ModalFooter` structure with `appendTo` prop.
Drag-Drop Component Migration `web/src/components/modals/columns-modal.tsx`, `web/src/components/modals/overview-panels-modal.tsx`, `web/src/components/modals/columns-modal.css`, `web/src/components/modals/overview-panels-modal.css`	Migrated from PatternFly React-Core DragDrop/Draggable to `@patternfly/react-drag-drop` DragDropSort. Updated reorder logic to use `onDrop` handler with oldIndex/newIndex mapping. Adjusted DataList rendering and CSS centering rules for v6.
Charts Library Import Updates `web/src/components/metrics/chart-voronoi.tsx`, `web/src/components/metrics/histogram.tsx`, `web/src/components/metrics/metrics-donut.tsx`, `web/src/components/metrics/metrics-graph-total.tsx`, `web/src/components/metrics/metrics-graph.tsx`	Updated PatternFly chart component imports from `@patternfly/react-charts` to `@patternfly/react-charts/victory`. Adjusted ChartLegendTooltip title callback typing. Removed dark chart theming in `metrics-content.css`.
Form Component Updates `web/src/components/forms/dynamic-form/error-boundary.tsx`, `web/src/components/forms/dynamic-form/fields.tsx`, `web/src/components/forms/flowCollector-status.tsx`, `web/src/components/forms/flowCollector-wizard.tsx`, `web/src/components/forms/flowMetric-wizard.tsx`, `web/src/components/forms/resource-form.tsx`	Added optional `children?: React.ReactNode` to form component props. Updated PageSection components to use `hasBodyWrapper={false}`. Simplified accordion control flow by removing `isHidden` prop usage.
React Router v5→v6 Migration `web/src/standalone/app.tsx`, `web/src/utils/url.ts`, `web/setup-tests.tsx`	Updated router imports from `react-router-dom-v5-compat` to `react-router`. Updated mocks in test setup from `react-router-dom` to `react-router`. Renamed `Page` header prop from `header` to `masthead`.
React 18 Upgrade `web/src/standalone/index.tsx`, `web/src/standalone/header.tsx`	Replaced `ReactDOM.render` with `createRoot` API. Updated header theme toggle to use `pf-v6-theme-dark` class and reorganized masthead structure with `MastheadToggle` inside `MastheadMain`. Added `data-codemods` attributes.
Testing Library Updates `web/src/utils/__tests__/fullscreen-hook.spec.ts`, `web/src/utils/__tests__/poll-hook.spec.ts`, `web/src/utils/__tests__/theme-hook.spec.ts`, `web/src/components/modals/__tests__/*.spec.tsx`, `web/src/components/dropdowns/__tests__/query-options-dropdown.spec.tsx`, `web/src/components/tabs/netflow-overview/__tests__/netflow-overview-panel.spec.tsx`, `web/src/components/tabs/netflow-topology/__tests__/netflow-topology.spec.tsx`, `web/src/components/toolbar/filters/__tests__/filters-toolbar.spec.tsx`	Migrated hook testing from `@testing-library/react-hooks` to `@testing-library/react`. Updated DOM selectors to target PatternFly v6 classes. Updated theme-hook test to check for `pf-v6-theme-dark` and verify MutationObserver cleanup.
TypeScript Type Alias Fixes `web/src/utils/dns.ts`, `web/src/utils/dscp.ts`, `web/src/utils/icmp.ts`, `web/src/utils/pkt-drop.ts`	Fixed indexed-access type syntax for array element unions by parenthesizing `typeof` expressions (`typeof arr[number]` → `(typeof arr)[number]`). No runtime logic changes.
Utility Hook Updates `web/src/utils/fullscreen-hook.ts`, `web/src/utils/theme-hook.ts`, `web/src/utils/outside-hook.ts`	Updated DOM selectors to target only PatternFly v6 classes. Updated dark-theme detection to check both `pf-v5-theme-dark` and `pf-v6-theme-dark`. Narrowed portal exclusion filter to v6 menu/select classes.
Page Layout & Styling Updates `web/src/components/netflow-traffic-dev-tab.tsx`, `web/src/components/netflow-traffic-parent.tsx`, `web/src/components/netflow-traffic.css`, `web/src/components/tabs/netflow-overview/netflow-overview.css`, `web/src/components/tabs/netflow-topology/netflow-topology.css`, `web/src/standalone/index.css`, `web/src/components/forms/forms.css`	Updated PageSection components to use `hasBodyWrapper={false}`. Consolidated background styling to use single theme variable instead of `.light`/`.dark` overrides. Updated page/container background colors to use `--pf-t--global--background--color--*` tokens.
Health Card & Score Components `web/src/components/health/health-card.tsx`, `web/src/components/health/health-color-square.tsx`, `web/src/components/health/health-helper.ts`, `web/src/components/health/health-metric-card.tsx`, `web/src/components/health/health-scoring-drawer.tsx`, `web/src/components/health/health-summary.tsx`	Updated health card data-test attributes, selectable action wiring, and screen-reader id usage. Changed `getSeverityColor` return type from LabelColor to specific color union. Updated typography to use Content/ContentVariants. Updated text color from palette CSS variables to fixed hex values.
Alerts & Fetcher Components `web/src/components/alerts/fetcher.tsx`	Added optional `children?: React.ReactNode` to AlertFetcherProps. Component now renders and appends children after alerts container when truthy.
Query Summary & Metrics Display `web/src/components/query-summary/summary-panel-content.tsx`, `web/src/components/query-summary/flows-query-summary-content.tsx`, `web/src/components/query-summary/metrics-query-summary-content.tsx`, `web/src/components/query-summary/stats-query-summary.tsx`, `web/src/components/query-summary/summary-panel.tsx`, `web/src/components/query-summary/summary-panel.css`	Updated typography to Content/ContentVariants. Refactored accordion control flow to use `isExpanded` on `AccordionItem` only. Updated CSS selector for v6 content class. Updated theme token usage in warning color.
Localization & Configuration `web/locales/en/plugin__netobserv-plugin.json`, `.golangci.yml`	Fixed typo in translation string (`"does't match"` → `"doesn't match"`). Removed `"Reorder column"` and `"Reorder panel"` translation entries. Added `node_modules` directory exclusion to golangci-lint configuration.
Package Dependencies `web/package.json`	Upgraded PatternFly from v5 to v6, React 17 to 18, React Router to v6 (`~7.13.1`). Added `@patternfly/react-drag-drop` and `@testing-library/dom`. Removed `@testing-library/react-hooks` and `react-modal`. Updated webpack from fixed `5.75.0` to `^5.100.0`. Removed `@types/react-modal`, `@types/react-router`, `@types/react-router-dom`. Added `victory` chart library. Removed `overrides.cheerio`.

Estimated code review effort

🎯 5 (Critical) | ⏱️ ~120 minutes

Possibly related PRs

NETOBSERV-2097 styling fixes for OCP 4.21 #1417: Overlapping changes to chart-voronoi, metrics-content.css, modal styling, and fullscreen hook utilities across the same UI/layout files.
NETOBSERV-2653 & NETOBSERV-2689: TLS updates and PF pre-migration refactor changes #1395: Both PRs modify web/cypress/integration-tests/table_queryopts.cy.ts with PatternFly class selector updates and DSCP test behavior changes.
NETOBSERV-2683 fix dropdowns state change #1378: Both PRs update web/cypress/views/netflow-page.ts with PatternFly v6 selector migrations and dropdown/command handling adjustments.

✨ Finishing Touches

🧪 Generate unit tests (beta)

Create PR with unit tests

memodi · 2026-03-26T17:29:00Z

/ok-to-test

github-actions · 2026-03-26T17:33:15Z

New image:

quay.io/netobserv/network-observability-console-plugin:5ae2178

It will expire in two weeks.

To deploy this build, run from the operator repo, assuming the operator is running:

USER=netobserv VERSION=5ae2178 make set-plugin-image

codecov · 2026-03-26T20:18:28Z

Codecov Report

❌ Patch coverage is 65.54622% with 41 lines in your changes missing coverage. Please review.
✅ Project coverage is 52.37%. Comparing base (c83176f) to head (b5d7a94).

Files with missing lines	Patch %	Lines
...eb/src/components/modals/overview-panels-modal.tsx	55.88%	14 Missing and 1 partial ⚠️
web/src/components/modals/columns-modal.tsx	48.00%	13 Missing ⚠️
web/src/components/modals/modal.tsx	50.00%	3 Missing and 1 partial ⚠️
...omponents/drawer/element/element-panel-content.tsx	0.00%	2 Missing ⚠️
...eb/src/components/drawer/element/element-panel.tsx	0.00%	2 Missing ⚠️
web/src/components/drawer/record/record-field.tsx	50.00%	1 Missing ⚠️
web/src/components/drawer/record/record-panel.tsx	50.00%	1 Missing ⚠️
web/src/components/health/health-color-square.tsx	0.00%	1 Missing ⚠️
web/src/components/metrics/chart-voronoi.tsx	50.00%	1 Missing ⚠️
...ponents/tabs/netflow-topology/netflow-topology.tsx	50.00%	1 Missing ⚠️

Additional details and impacted files

@@            Coverage Diff             @@
##             main    #1365      +/-   ##
==========================================
- Coverage   52.48%   52.37%   -0.11%     
==========================================
  Files         229      229              
  Lines       12246    12220      -26     
  Branches     1531     1522       -9     
==========================================
- Hits         6427     6400      -27     
+ Misses       5224     5217       -7     
- Partials      595      603       +8

Flag	Coverage Δ
uitests	`56.57% <65.54%> (-0.14%)`	⬇️
unittests	`40.96% <ø> (ø)`

Flags with carried forward coverage won't be shown. Click here to find out more.

Files with missing lines	Coverage Δ
web/src/components/alerts/banner.tsx	`41.17% <100.00%> (ø)`
web/src/components/alerts/fetcher.tsx	`55.00% <ø> (ø)`
...eb/src/components/drawer/element/element-field.tsx	`100.00% <100.00%> (ø)`
...b/src/components/drawer/element/element-fields.tsx	`59.25% <100.00%> (ø)`
...omponents/drawer/element/element-panel-metrics.tsx	`83.33% <100.00%> (ø)`
.../components/drawer/element/element-panel-stats.tsx	`86.36% <100.00%> (ø)`
...components/dropdowns/overview-display-dropdown.tsx	`42.85% <ø> (ø)`
.../components/dropdowns/overview-display-options.tsx	`72.72% <100.00%> (ø)`
...rc/components/dropdowns/query-options-dropdown.tsx	`95.00% <ø> (ø)`
...b/src/components/dropdowns/query-options-panel.tsx	`78.12% <100.00%> (+2.26%)`	⬆️
... and 52 more

... and 7 files with indirect coverage changes

🚀 New features to boost your workflow:

❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

Amoghrd · 2026-04-10T20:59:44Z

/label qe-approved

Amoghrd · 2026-04-15T15:03:44Z

/ok-to-test

github-actions · 2026-04-15T15:20:28Z

New image:

quay.io/netobserv/network-observability-console-plugin:2a198f7

It will expire in two weeks.

To deploy this build, run from the operator repo, assuming the operator is running:

USER=netobserv VERSION=2a198f7 make set-plugin-image

github-actions · 2026-04-15T15:20:41Z

New image:

quay.io/netobserv/network-observability-console-plugin:2a198f7

It will expire in two weeks.

To deploy this build, run from the operator repo, assuming the operator is running:

USER=netobserv VERSION=2a198f7 make set-plugin-image

github-actions · 2026-04-15T17:54:28Z

New image:

quay.io/netobserv/network-observability-console-plugin:e8d3cd5

It will expire in two weeks.

To deploy this build, run from the operator repo, assuming the operator is running:

USER=netobserv VERSION=e8d3cd5 make set-plugin-image

jpinsonneau · 2026-04-15T18:55:35Z

Rebased without changes

Created branch main-pf5 to unlock this PR: https://github.com/netobserv/netobserv-web-console/tree/main-pf5

github-actions · 2026-04-15T19:00:33Z

New image:

quay.io/netobserv/network-observability-console-plugin:efd7955

It will expire in two weeks.

To deploy this build, run from the operator repo, assuming the operator is running:

USER=netobserv VERSION=efd7955 make set-plugin-image

github-actions · 2026-04-16T12:44:14Z

New image:

quay.io/netobserv/network-observability-console-plugin:096ae89

It will expire in two weeks.

To deploy this build, run from the operator repo, assuming the operator is running:

USER=netobserv VERSION=096ae89 make set-plugin-image

github-actions · 2026-04-16T14:36:12Z

New image:

quay.io/netobserv/network-observability-console-plugin:8d1d813

It will expire in two weeks.

To deploy this build, run from the operator repo, assuming the operator is running:

USER=netobserv VERSION=8d1d813 make set-plugin-image

github-actions · 2026-04-16T15:50:21Z

New image:

quay.io/netobserv/network-observability-console-plugin:db89bba

It will expire in two weeks.

To deploy this build, run from the operator repo, assuming the operator is running:

USER=netobserv VERSION=db89bba make set-plugin-image

github-actions · 2026-04-16T16:05:39Z

New image:

quay.io/netobserv/network-observability-console-plugin:506b580

It will expire in two weeks.

To deploy this build, run from the operator repo, assuming the operator is running:

USER=netobserv VERSION=506b580 make set-plugin-image

openshift-ci · 2026-04-16T16:17:12Z

@jpinsonneau: The following test failed, say /retest to rerun all failed tests or /retest-required to rerun all mandatory failed tests:

Test name	Commit	Details	Required	Rerun command
ci/prow/plugin-cypress	`5773672`	link	true	`/test plugin-cypress`

Full PR test history. Your PR dashboard.

Details

Instructions for interacting with me using PR comments are available here. If you have questions or suggestions related to my behavior, please file an issue against the kubernetes-sigs/prow repository. I understand the commands that are listed here.

openshift-ci bot added do-not-merge/work-in-progress needs-rebase labels Mar 20, 2026

jpinsonneau mentioned this pull request Mar 20, 2026

NETOBSERV-2097 pf6 update #721

Closed

10 tasks

jpinsonneau force-pushed the 4.22-migration branch 2 times, most recently from 0f4658e to 11b3cc6 Compare March 23, 2026 13:09

jpinsonneau marked this pull request as ready for review March 23, 2026 17:06

openshift-ci bot removed the do-not-merge/work-in-progress label Mar 23, 2026

jpinsonneau requested review from OlivierCazade, jotak, leandroberetta and stleerh March 23, 2026 17:06

jpinsonneau force-pushed the 4.22-migration branch 2 times, most recently from 5abca8c to 55214bb Compare March 23, 2026 17:28

openshift-ci bot removed the needs-rebase label Mar 23, 2026

jpinsonneau force-pushed the 4.22-migration branch from 49fd44e to d7b103e Compare March 24, 2026 11:26

openshift-ci bot added the needs-rebase label Mar 25, 2026

jpinsonneau force-pushed the 4.22-migration branch from d7b103e to 62e5349 Compare March 26, 2026 10:00

openshift-ci bot removed the needs-rebase label Mar 26, 2026

openshift-ci bot added the ok-to-test To set manually when a PR is safe to test. Triggers image build on PR. label Mar 26, 2026

openshift-ci bot added the needs-rebase label Mar 31, 2026

openshift-ci bot added the qe-approved QE has approved this pull request label Apr 10, 2026

github-actions bot removed the ok-to-test To set manually when a PR is safe to test. Triggers image build on PR. label Apr 15, 2026

openshift-ci bot added the ok-to-test To set manually when a PR is safe to test. Triggers image build on PR. label Apr 15, 2026

Amoghrd added ok-to-test To set manually when a PR is safe to test. Triggers image build on PR. and removed ok-to-test To set manually when a PR is safe to test. Triggers image build on PR. labels Apr 15, 2026

Amoghrd force-pushed the 4.22-migration branch from 1693015 to b9c1ec0 Compare April 15, 2026 17:49

github-actions bot removed the ok-to-test To set manually when a PR is safe to test. Triggers image build on PR. label Apr 15, 2026

Amoghrd added the ok-to-test To set manually when a PR is safe to test. Triggers image build on PR. label Apr 15, 2026

jpinsonneau and others added 3 commits April 15, 2026 20:51

sdk + pf6 migration

99263fd

data test ids

105aead

Add some more data-test ids

505fdb4

jpinsonneau force-pushed the 4.22-migration branch from b9c1ec0 to 505fdb4 Compare April 15, 2026 18:55

github-actions bot removed the ok-to-test To set manually when a PR is safe to test. Triggers image build on PR. label Apr 15, 2026

PF updates and styling fix

5e64155

jpinsonneau added 2 commits April 16, 2026 16:31

installDemoLoki & fullscreen issues

a49b8e8

standalone theme

06b9ec5

fix redirect after FlowCollector create

c67665f

force update on CR change

5773672

Conversation

jpinsonneau commented Mar 20, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Description

Dependency Updates

OpenShift Console SDK

PatternFly 6

React 18

React Router 7

i18next

Testing

Webpack & Build

Other

Automated Codemods Applied

TypeScript Error Resolution (All 125 errors fixed)

CSS / Theme Migration

Dark Mode

CSS Variable Migration (PF5 → PF6 tokens)

isDark prop cleanup

PF6 Component Workarounds

DragDropSort portal target (modal.tsx)

Nested Accordion expand/collapse (fields.tsx, dynamic-form.css)

Build Tooling

Checklist

Tested on OCP 4.22.0-0-2026-04-02-114050-test-ci-ln-vi34h7b-latest

Summary by CodeRabbit

Uh oh!

openshift-ci bot commented Mar 20, 2026

Uh oh!

jpinsonneau commented Mar 26, 2026

Uh oh!

coderabbitai bot commented Mar 26, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Reviews paused

Walkthrough

Changes

Estimated code review effort

Possibly related PRs

Uh oh!

memodi commented Mar 26, 2026

Uh oh!

github-actions bot commented Mar 26, 2026

Uh oh!

codecov bot commented Mar 26, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Codecov Report

Uh oh!

Amoghrd commented Apr 10, 2026

Uh oh!

Amoghrd commented Apr 15, 2026

Uh oh!

github-actions bot commented Apr 15, 2026

Uh oh!

github-actions bot commented Apr 15, 2026

Uh oh!

github-actions bot commented Apr 15, 2026

Uh oh!

jpinsonneau commented Apr 15, 2026

Uh oh!

github-actions bot commented Apr 15, 2026

Uh oh!

github-actions bot commented Apr 16, 2026

Uh oh!

github-actions bot commented Apr 16, 2026

Uh oh!

github-actions bot commented Apr 16, 2026

Uh oh!

github-actions bot commented Apr 16, 2026

Uh oh!

openshift-ci bot commented Apr 16, 2026 • edited Loading Uh oh! There was an error while loading. Please reload this page.

Uh oh!

Uh oh!

Reviewers

Assignees

Labels

Projects

Milestone

Development

Uh oh!

4 participants

jpinsonneau commented Mar 20, 2026 •

edited

Loading

`isDark` prop cleanup

DragDropSort portal target (`modal.tsx`)

Nested Accordion expand/collapse (`fields.tsx`, `dynamic-form.css`)

coderabbitai bot commented Mar 26, 2026 •

edited

Loading

codecov bot commented Mar 26, 2026 •

edited

Loading

openshift-ci bot commented Apr 16, 2026 •

edited

Loading